 <div class="row">
 	<div class="col-md-12">
		<div class="page-header">
		  <h1>Calendario</h1>
		</div>
		<div class="btn-group btn-group-justified " id="sucbt">
		  	<a href="" class="btn well" data-id="0"><b>Todos</b></a>
		  	<?php foreach ($branches as $key => $value):?>
		  		<a href="#" class="btn well" data-id='<?php echo $key;?>'><b><?php echo $value;?></b></a>
				<?php endforeach;?>
		</div>
		<br>

		<div id="maincalendar"></div>	 
		
 	</div>

</div>
 




<!-- MODAL SHOW EVENT DETAIL START -->
<div class="modal fade" id="eventDetail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3 class="modal-title" id="eventLabel">Turno # :  - <span>Sucursal:  Rawson</span></h3>
      </div>
      <div class="modal-body">
      	
        <div class="form-group">
		    <label for="inputEmail3" class="col-sm-4 control-label">Servicio</label>
		    <div class="col-sm-6">					     
		    	<p id='servicio'></p>  
		    </div>
	  	</div>
	  	<div class="form-group">
		    <label for="inputEmail3" class="col-sm-4 control-label">Fecha y hora: </label>
		    <div class="col-sm-6">					     
		    	<p id='datetime'></p>  
		    </div>
	  	</div>
	  	<div class="clearfix"><br></div>
	  	<div class="form-group">
		    <label for="inputEmail3" class="col-sm-4 control-label">Cliente</label>
		    <div class="col-sm-6">					     
		    	<p id='client'></p>  
		    </div>
	  	</div>
	  	<div class="form-group">
		    <label for="inputEmail3" class="col-sm-4 control-label">Datos de Contacto</label>
		    <div class="col-sm-6">					     
		    	<p id='data_contact'></p>  
		    </div>
	  	</div>

	  	<div class="form-group">
		    <label for="inputEmail3" class="col-sm-4 control-label"></label>
		    <div class="col-sm-6">					     
		    	<p id='data_contact'></p>  
		    </div>
	  	</div>
	  	<input type='hidden' id='event_id' value=''>
	  	<div class="form-group">
      <div class="col-sm-offset-2 col-sm-10">
         <div class="checkbox">
            <label>
               <input type="checkbox" id='delay_ck'> No Aviso en Termino? 
            </label>
         </div>
      </div>

   </div>
	  	

	  	<div class="clearfix"><br></div>        
    	
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
        <?php echo $this->Html->link(__('Posponer', true), array('controller' => 'events', 'action' => 'delay' ),array('class'=>'btn btn-info','id'=>'delay_bt')); ?> 
        <!-- <?php echo $this->Html->link(__('Confirmar', true), array('controller' => 'events', 'action' => 'present' ),array('class'=>'btn btn-info','id'=>'confirm_bt')); ?>  -->
      </div>
    </div>
  </div>
</div>
<!-- MODAL SHOW EVENT DETAIL END -->

<!-- MODAL NEW EVENT START-->
<div class="modal fade" id="newevent" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
       <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3 class="modal-title" id="eventLabel">Crear Turno</h3>
        <label for="inputEmail3" class="col-sm-5 control-label">¿ Desea Crear un turno ?</label>
      </div>
      <div class="modal-body">
      	<form action='/events/add_alt' method='post' class="form-horizontal" role="form">
      		<div class="form-group">
		    		<label for="EventsDate" class="col-sm-2 control-label">Sucursal:</label>
			    	<div class="col-sm-6">				
			    		<select class='form-control ' id="EventsBranchId" name='Events[branch_id]' data-placeholder="Choose a country...">
				    		<option value='0' >-</option>
				    		<option value='1'>Rivadavia</option>
				    		<option value='2'>Centro</option>
				    	</select>    	
			    	</div>
		    	</div>

      		<div class="form-group">
		    		<label for="EventsDate" class="col-sm-2 control-label">Fecha: </label>
			    	<div class="col-sm-6">				
			    		<input type="text" class="form-control" id="EventsDate" name='Events[date]' placeholder="Fecha">		    	
			    	</div>
		    	</div>

		    	<div class="form-group">
		    		<label for="EventsTime" class="col-sm-2 control-label">Horario:</label>
			    	<div class="col-sm-6">				
			    		<input type="text" class="form-control" id="EventsTime"  name='Events[time_from]' placeholder="Horario">		    	
			    	</div>
		    	</div>

      	</form>

      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
         <button id='newevent_bt' type="button" class="btn btn-primary">Crear</button> 
      </div>
    </div>
  </div>
  <input type="hidden" name='url' id='url' value="<?php echo $this->Html->url( '/', true ); ?>">


</div>
<!-- MODAL NEW EVENT END-->

 <input type='hidden' id='branch_id_selected' value=0>
<script type="text/javascript">	


	function load_calendar(branch_id)
	{

		var new_events= false;
		$.ajax({ url: "events/get_all",type: "POST",data:{branch_id:branch_id},dataType: "json", async: false,success:function(data){			
			new_events =  data;
		}});
		//console.debug('events: %',new_events );
		$('#maincalendar').empty();		
		$('#maincalendar').fullCalendar('removeEvents').fullCalendar(
		{ 
			defaultView: 'agendaDay',
      		editable: true,
        	selectable: true,
			header: {
			    left: 'prev,next today',
			    center: 'title',
			    right: 'month,agendaWeek,agendaDay'
		    },
 			timeFormat: {
    		agenda: 'h(:mm)t{ - h(:mm)t}',
    			'': 'h(:mm)t{-h(:mm)t }'
   		},

   		slotMinutes: 15,
	    allDaySlot: false,
	    editable: true,
	    selectable: true,
	    lazyFetching: true,
   		minTime: 8,
			maxTime: 21,	
	   	monthNames: ["Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre" ], 
	   	monthNamesShort: ['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'],
	   	dayNames: [ 'Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
	   	dayNamesShort: ['Dom','Lun','Mar','Mié','Jue','Vie','Sáb'],
	   	buttonText: {
	   	 	today: 'hoy',
	    	month: 'mes',
	    	week: 'semana',
	    	day: 'día'
	   	},
			editable: true,
			events: new_events,
			eventRender: function(event, element) {
				var paid="Parcial";
				if(event.paid==true){
					paid="Pagado";
				}			
		       	element.find('.fc-event-title').append("<br/><b> - Pagado: " + paid+"</b>"); 
		    },
			eventClick:function(calEvent, jsEvent, view)
			{				
				var eventId = calEvent.id;
				var url = "home/modal_event_data/"+eventId				
				var client_json = $.getJSON(url,function(data){
					$("#event_id").val(eventId);
					$("#eventLabel").html("Turno # : "+eventId+"  - <span>Sucursal : "+data.Branches.name+"</span>")
					$("#servicio").html(data.Services.service_code+" - "+data.Services.name);
					$("#client").html(data.Clients.full_name);

					if(data.Events.is_changed==1){

						$("#datetime").html(" El turno fue postergado para "+data.Events.date_changed+" "+data.Events.time_from_changed);				
						$("#delay_bt").addClass('hidden');	

					}else{
						$("#datetime").html(""+data.Events.date+" "+data.Events.time_from);
						$("#delay_bt").attr('href',$("#delay_bt").attr('href')+'/'+eventId);	
					}	
					//status== 2 Cliente presente y turno esta vigente
					if(data.Events.status==2){
						$("#confirm_bt").removeClass("btn btn-info").addClass("btn btn-success").text("Confirmado").attr('disabled',true);
					}
					if(data.Events.status==3){
						$("#confirm_bt").removeClass("btn btn-info").addClass("btn btn-danger").text("Vencido").attr('disabled',true);
					}



					$("#data_contact").html(data.Clients.email+"<br> "+data.Clients.phone_cell+"<br> "+data.Clients.phone_home+"<br> ");
					$("#eventDetail").modal("show");
			  	});
			},
			dayClick:function(date, allDay, jsEvent, view){				
				var d = Date.parse(date) / 1000;
				$("#EventsBranchId").val($("#branch_id_selected").val());
				$("#EventsDate").val(date.getDate()+'-'+(date.getMonth()+1)+'-'+date.getFullYear());
				$("#EventsTime").val(date.getHours()+':'+date.getMinutes());
				$("#newevent").modal("show");				
			}			
		});


	}

	$(document).ready(function() 
	{
		$("#EventsBranchId").val(0);
		$(".chosen-select").chosen({no_results_text: "No hay Resultados!"});
    $('#EventsDate').datetimepicker({ format: 'DD-MM-YYYY',language: 'es',pickTime: false});
    $('#EventsTimeFrom').datetimepicker({
			format:'hh:mm',
			minuteStep:20,
      pickDate: false
    });
		load_calendar(0);
		$("#sucbt a").click(function(){
			var id= $(this).data('id');
			load_calendar(id);	
			$("#branch_id_selected").val(id);		
		});


		$("#postpone_bt").click(function(){
			if($(this).is(":checked")){
				alert("pospone");
				$("#postpone_div").removeClass("hidden");
			}
			else{
				$("#postpone_div").addClass("hidden");

			}
		});

		$("#newevent_bt").click(function(){
			
			
			result=true;
			if($("#EventsBranchId option:selected").length==0){
				result = false;
				alert("Error EventsBranchId");
			}
			if($("#EventsDate").val()==0){
				result = false;
				alert("Error EventsDate");
			}
			if($("#EventsTime").val()==0){
				result = false;
				alert("Error EventsTime");
			}
			if (result){
				$("form").submit();
			}
			return result;
		});

		$("#delay_ck").click(function(){
			var main_url= $("#url").val();
			var event_id= $("#event_id").val();
			console.debug(event_id);
			if($(this).is(":checked"))
			{
				var url= //$("#delay_bt").attr('href');
				$("#delay_bt").attr('href',main_url+'events/delay/'+event_id+'/1');
				$("#delay_bt").text('Nuevo Turno');
			}else{
				$("#delay_bt").attr('href',main_url+'events/delay/'+event_id+'/0');
				$("#delay_bt").text('Posponer');	
			}
			
		});

		/*


		$("#categoria").on('change', function() {
		  var optionSelected = $("option:selected", this);
    	  var valueSelected = this.value;
    	  console.debug("tre %o",optionSelected);//+" => "+valueSelected);
		  $("zona").empty();
		});

		$(".add_service").click(function(){
			//alert("test");
			$(".list-group").append("<li class='list-group-item'>New servicio</li>");

		});*/


		
		
	});
</script>